/*
* @Description:系统管理-密码管理
* @Author: lil
* @Date: 2021/11/24
**/
<template>
  <div class="pswd-manage">
    <p>重置密码</p>
    <!-- 表单 -->
    <el-form label-width="80px">
      <el-form-item label="用户名:">
        <el-input v-model="uName" placeholder="请输入用户名"></el-input>
      </el-form-item>
      <el-form-item label="密码:">
        <el-input :type="invisible" v-model="pswd" placeholder="请输入密码">
          <i slot="suffix" :class="iconName" @click="showPswd"></i>
        </el-input>
      </el-form-item>
      <el-form-item label="确认密码:">
        <el-input :type="invisible2" v-model="confirmPswd" placeholder="请输入确认密码">
          <i slot="suffix" :class="iconName2" @click="showConfirmPswd"></i>
        </el-input>
      </el-form-item>
      <el-form-item label-width="0" class="btns">
        <el-button type="primary" @click="confirm">确认</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
  import {
    alterPassword
  } from '@/api/blockchain/deployhost'
  import {
    Encrypt
  } from '@/utils/aestwo'
  export default {

    data() {
      return {
        // 用户名
        uName: '',
        // 密码
        pswd: '',
        // 确认密码
        confirmPswd: '',
        invisible: 'text',
        invisible2: 'text',
        iconName: 'iconfont zfsoft-huyanmoshi',
        iconName2: 'iconfont zfsoft-huyanmoshi',
      };
    },
    methods: {
      confirm() {
        let _this = this;
        if (_this.uName == '' || _this.pswd == "" || _this.confirmPswd == '') {
          _this.$message.error("请输入用户名或密码")
          return
        }
        if (_this.confirmPswd == _this.pswd) {
          alterPassword(Encrypt(_this.uName), Encrypt(_this.confirmPswd)).then(function (res) {
            if (_this.uName == 'admin') {
              _this.$confirm('密码修改成功，请重新登录!', '提示', {
                confirmButtonText: '确定',
                showCancelButton: false,
                closeOnClickModal: false,
                showClose: false,
                center: true,
                type: 'warning'
              }).then(() => {
                _this.$store.dispatch('LogOut').then(() => {
                  location.reload()
                })
              }).catch(() => {
                _this.$store.dispatch('LogOut').then(() => {
                  location.reload()
                })
              });
            } else {
              _this.$message.success('密码修改成功！')
            }
            _this.uName = '';
            _this.pswd = '';
            _this.confirmPswd = '';
          })
        } else {
          _this.$message.error("请确保两次密码输入一致")
        }
      },

      showPswd() {
        if (this.invisible == 'text') {
          this.invisible = 'password';
          this.iconName = 'iconfont zfsoft-yincang';
        } else {
          this.invisible = 'text';
          this.iconName = 'iconfont zfsoft-huyanmoshi';
        }
      },
      showConfirmPswd() {
        if (this.invisible2 == 'text') {
          this.invisible2 = 'password';
          this.iconName2 = 'iconfont zfsoft-yincang';
        } else {
          this.invisible2 = 'text';
          this.iconName2 = 'iconfont zfsoft-huyanmoshi';
        }
      }
    }
  };

</script>
<style lang="scss" scoped>
  .pswd-manage {
    width: 438px;
    padding: 20px 40px;
    margin: 120px auto 0;
    background-color: #fff;
    border: 1px solid #e0e6f0;

    p {
      text-align: center;
      font-size: 20px;
      color: #3c4551;
      margin-bottom: 45px;
    }
  }

  .btns {
    text-align: center;
    margin-top: 50px;
  }

</style>
